<template>
    <div class="block">
        <div class="l_up">
            <div class="tu"><img :src="img" alt="" /></div>
            <div class="title">{{title}}</div>
            <div class="more"><a href="solution_detail_1.html" target="_blank"><img src="./icon1.png" alt="" /></a></div>
        </div>
        <div class="l_dn">
            <div class="l_line"><span>&nbsp;</span></div>
            <p>{{desc}}</p>
            <a href="solution_detail_1.html" target="_blank">MORE</a>
        </div>
    </div>
</template>
<script>
export default {
    props: {
        title: {
            type: String,
            default: function() {
                return ""
            }
        },
        desc: {
            type: String,
            default: function() {
                return ""
            }
        },
        img: {
            type: String,
            default: function() {
                return ""
            }
        },
    }
}
</script>
<style lang="stylus" scoped>
.block
    .l_up
        width:100%; height:225px; position:relative;
        .tu
            height:160px; margin:0px auto;
            .img 
                width:100%; height:100%; vertical-align:top;
        .title
            width:100%; height:50px; text-align:center; margin-top:15px; color:#004587; font-size:18px;

        .more
            width:100%; height:225px; background:url(./bg_d.png) repeat; position:absolute; left:0px; top:0px; z-index:2; display:none;
            img 
                 width:48px; height:48px; vertical-align:top; margin-top:70px;
    .l_dn
        width:100%; height:153px;
        .l_line
            display:inline-block; *display:inline; zoom:1; width:140px; margin:0px auto; height:2px; text-align:left; background:#8B8D90;
            span 
                display:block; width:60px; height:2px; background:#004588;
        p
            width:90%; margin:0px auto; padding-top:20px; color:#004587; font-size:14px; line-height:175%;
        a 
            font-size:14px; color:#FFFFFF; margin-top:15px; display:none;

    &:hover
        .l_up
            .more
                display:block
        .l_dn
             background:url(./bg_a.jpg) no-repeat; background-size:cover;
             a 
                display:block;
            .l_line
                display: none
            p 
                color:#FFF;
</style>